<template>
  <div id="answerview">
    <div class="answer-msg">
      <p>点赞数: <span>{{questionview.praise}}</span></p>
      <p>喜爱数: <span>{{questionview.likes}}</span></p>
      <p>浏览数: <span>{{questionview.views}}</span></p>
      <p>收藏数: <span>{{questionview.collect}}</span></p>
      <p>赞赏金额: <span>{{questionview.praise_money}}</span></p>
      <p>回帖数量: <span>{{questionview.reply_num}}</span></p>
      <p>作者昵称: <span>{{questionview.nickname}}</span></p>
      <p>发布时间: <span>{{questionview. add_time}}</span></p>
      <p>更新时间: <span>{{questionview.update_time}}</span></p>
      <p>文章状态: <span>{{questionview.status}}</span></p>
      <p>作者用户名: <span>{{questionview.username}}</span></p>
      <el-button size="mini" @click="goto" style="float: left;">查看评论</el-button>
      <div style="width: 100px;float: left;margin-left: 20px;">
        <form :action="config.apiURI + 'articleviews/exportexcel/' + this.$route.params.id" method="post" target="_blank">
          <button type="submit" style="background: none;border: 1px solid #cccccc;cursor: pointer;padding: 5px 15px;border-radius: 5px">导出浏览人</button>
        </form>
      </div>
    </div>
    <div class="answer-content">
      <p class="title">{{questionview.title}}</p>
      <p class="tags">
        <span v-for="tag in questionview.tags" :key="tag.id">{{tag.alias}}</span>
      </p>
      <editor :content='questionview.content'></editor>
    </div>
    <div class="clear"></div>
  </div>
</template>

<script>
import msgbox from '@/common/msgbox.js'
import editor from '../../assets/editor/content'
import config from '../../common/config'

export default {
  name: 'answerview',
  components: {
    editor: editor
  },
  config,
  data () {
    return {
      config: config,
      questionview: {
        tags: [
          {tag_id: '', tag_name: ''}
        ]
      }
    }
  },
  mounted () {
    this.view()
  },
  methods: {
    view () {
      let that = this
      this.$g.ajax({
        path: 'articles/view/' + this.$route.params.id,
        method: 'get',
        cbSuccess: function (data) {
          that.questionview = data.memo
        },
        cbError: function (data) {
          let msg = msgbox.get(data.msg)
          that.$message.error(msg)
        }
      })
    },
    goto () {
      this.$router.push('/articlereplies/index/' + this.questionview.id + '/1')
    }
  }
}
</script>

<style lang="scss" scoped>
  #answerview {
    padding-bottom: 20px;
    .answer-content {
      margin-right: 400px;
      .title {
        font-size: 20px;
        font-weight: bold;
        line-height: 36px;
      }
      .tags {
        margin-bottom: 10px;
        span {
          margin-right: 20px;
          font-size: 14px;
          color: #666;
        }
      }
    }
    .answer-msg {
      width: 360px;
      padding: 10px;
      float: right;
      font-size: 16px;
      border: 1px solid #00a4a0;
      p {
        line-height: 30px;
        color: #666;
        span {
          color: #333;
          margin-left: 15px;
        }
      }
    }
  }
</style>
